<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<title>会员充值</title>
	<script src="/static/mobile/js/mui.min.js"></script>
	<link href="/static/mobile/css/mui.min.css" rel="stylesheet"/>
	<link rel="stylesheet" type="text/css" href="/static/mobile/css/basic.css"/>
	<link rel="stylesheet" type="text/css" href="/static/mobile/css/resiter_daili_3.css"/>
	<script type="text/javascript" src="/static/mobile/js/jquery.js"></script>
	<link rel="stylesheet" href="/static/plugins/layui/css/layui.css">
	<script type="text/javascript" charset="utf-8">
		mui.init();
	</script>
	<style>
		.section2 .sub button {
			width: 100%;
			padding: 5px;
			font-size: 1rem;
			color: #fff;
			background: #E52D2D;
			border-color: #E52D2D;
		}
	</style>
</head>
<body>
<div class="sectionx">
	<header class="mui-bar mui-bar-nav" >
		<a class="mui-icon mui-icon-left-nav mui-pull-left" href="javascript:history.back(-1)" style="color: #4E4E4E;"></a>
		<a class="mui-icon mui-icon  mui-pull-right right1" href="{:url('chongzhi_log')}" style="color: #4E4E4E;font-size: 0.8rem;padding-top: 18px;">充值记录</a>

		<h1 class="mui-title">会员充值</h1>
	</header>
</div>
<div class="layui-form">
	<form  method="post">
		<div class="section3">
			<div class="container">
				<p>公司收款信息</p>
			</div>
		</div>
		<div class="section2">
			<ul>
				<li class="lix mui-clearfix">
					{$sys.ads}
					<button style="float: right" class="layui-btn"  id="ads" data-clipboard-text="{$sys.ads}">一键复制</button>

				</li>
				<li class="lix mui-clearfix">
					{$sys.address_card}
					<button style="float: right" class="layui-btn"  id="copy_btn" data-clipboard-text="{$sys.address_card}">一键复制</button>

				</li>
				<li class="lix mui-clearfix">
					{$sys.username}
					<button style="float: right" class="layui-btn"  id="copy_btn1" data-clipboard-text="{$sys.username}">一键复制</button>

				</li>
			</ul>
		</div>
		<div class="section3">
			<div class="container">
				<p>收款二维码</p>
			</div>
		</div>
		<div class="section2">
			<ul>
				<li class="lix mui-clearfix">
					<img src="{$sys.collection}" style="width: 100%" class="aligncenter">
				</li>
			</ul>
		</div>
		<div class="section3">
			<div class="container">
				<p>会员充值</p>
			</div>
		</div>
		<div class="section2">
			<ul>
				<li class="lix mui-clearfix">
					<span>姓名</span>
					<input type="text" placeholder="请输入姓名" name='username' value='{$user.username}' readonly/>
					<span class="xing">*</span>
				</li>
			</ul>

			<ul>
				<li class="lix mui-clearfix">
					<span>手机号</span>
					<input type="text" placeholder="请输入手机号" name='mobile' value='{$user.mobile}' readonly/>
					<span class="xing">*</span>
				</li>
			</ul>
			<ul>
				<li class="lix mui-clearfix">
					<span>会员编号</span>
					<input type="text" placeholder="请输入会员编号" name='nickname' value='{$user.nickname}' readonly/>
					<span class="xing">*</span>
				</li>
			</ul>
			<ul>
				<li class="lix mui-clearfix">
				<span>充值类型</span>
				<span class="xing">*</span>
				<select name="chongtype" id="txid"  >
					{volist name='chongxian' id='vo'}
					<option value="{$vo.id}" {if $type==2} selected {/if}>{$vo.name}</option>
					{/volist}
				</select>
				</li>
			</ul>
			<ul>
				<li class="lix mui-clearfix">
					<span>充值金额</span>
					<input type="text" placeholder="请输入充值金额" name='mey' />
					<span class="xing">*</span>
				</li>
			</ul>
			<ul >
				<li class="lix mui-clearfix">
				<label class="layui-form-label" style="width: 120px">充值凭证</label>
				<input type="hidden" name="pzimg" id="pzimg">
				<div class="layui-input-block">
					<div class="layui-upload" >
						<button type="button" class="layui-btn layui-btn-primary" id="logoBtn" onclick="shijian('1')"><i class="icon icon-upload3"></i>点击上传</button>
						<input type="button" id = "btnHide" class="none" style="display: none">
						<div class="layui-upload-list">
							<img class="layui-upload-img" id="cltLogo" style="width: 80%">
							<p id="demoText"></p>
						</div>
					</div>
				</div>
				</li>
			</ul>
			<div class="ge"></div>
			<div class="sub">
				<button type="button" class="layui-btn" lay-filter="sub" lay-submit>充值申请</button>
			</div>
		</div>
	</form>
</div>
</body>
<script type="text/javascript" >
	mui('body').on( 'tap' , 'a' , function(){
		document.location.href=this.href;
	})
</script>

<script src="/static/plugins/layui/layui.js"></script>
<script src="/static/plugins/layui/layui.all.js"></script>
<script>
	layui.use(['form', 'layer','upload','element'], function () {
	//	var form = layui.form,$ = layui.jquery;
		var form = layui.form,layer = layui.layer,upload = layui.upload,$ = layui.jquery,element = layui.element;
		// 登录提交监听
		form.on('submit(sub)', function (data) {
			var loading = layer.load(1, {shade: [0.1, '#fff']});
			$.post("{:url('chongzhi')}",data.field,function(res){
				layer.close(loading);
				if(res.code > 0){
					layer.msg(res.msg,{time:1000,icon:1},function(){
						location.href = "{:url('chongzhi')}";
					});
				}else{
					layer.msg(res.msg,{time:1000,icon:2});
					// $('.captcha img').attr('src','{:url("verify")}?id='+Math.random());
				}
			});
		})
		var uploadInst = upload.render({
			elem: '#logoBtn'
			,accept: 'images'
			,field: 'file'
			,url: '{:url("user/UpFiles/upload")}'
			,auto: false
			,bindAction: "#btnHide"
			,before: function(obj){
				//预读本地文件示例，不支持ie8
				obj.preview(function(index, file, result){
					$('#cltLogo').attr('src', result); //图片链接（base64）
				});
			},choose: function(obj) {
				var files = obj.pushFile();
				var index, file, indexArr = [];
				for(index in files) {
					indexArr.push(index);
				};
				var iaLen = indexArr.length;
				file = files[indexArr[iaLen - 1]];
				for(var i = 0; i < iaLen - 1; i++) {
					delete files[indexArr[i]];
				}
				try {
					if(file.size > 200 * 1024) {
						delete files[index];
						photoCompress(file, {
							quality: 0.5,
						}, function(base64Codes) {
							var bl = convertBase64UrlToBlob(base64Codes);
							obj.resetFile(index, bl, file.name);
							$("#btnHide").trigger("click");
						});
					} else {
						$("#btnHide").trigger("click");
					}
				} catch(e) {
					$("#btnHide").trigger("click");
				}
			}
			,done: function(res){
				//上传成功
				if(res.code>0){
					$('#pzimg').val(res.url);
				}else{
					//如果上传失败
					return layer.msg('上传失败');
				}
			}
			,error: function(){
				//演示失败状态，并实现重传
				var demoText = $('#demoText');
				demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
				demoText.find('.demo-reload').on('click', function(){
					uploadInst.upload();
				});
			}
		});
	})

	/*1
	 */
	function shijian(type) {
		try {
			var data=window.android.upType();
			if(data==1){
				window.android.upload_image(type);
			}
		}catch(e){

		}
	}
	function jieshou(data,type) {
		if(type==1){
			$('#cltLogo').attr('src',data); //图片链接（base64）
			$('#pzimg').val(data);
		}else{
			$('#wechatcltLogo').attr('src',data); //图片链接（base64）
			$('#wechat').val(data);
		}
	}
</script>
<script type="text/javascript" src="/static/user/js/clipboard.js"></script>
<script>
	$(document).ready(function(){
		var clipboard = new Clipboard('#copy_btn');
		clipboard.on('success', function(e) {
			//mui.toast('复制成功！');
			alert('复制成功');
			e.clearSelection();
		});
	});
	$(document).ready(function(){
		var clipboard = new Clipboard('#copy_btn1');
		clipboard.on('success', function(e) {
			//mui.toast('复制成功！');
			alert('复制成功');
			e.clearSelection();
		});
	});	$(document).ready(function(){
		var clipboard = new Clipboard('#ads');
		clipboard.on('success', function(e) {
			//mui.toast('复制成功！');
			alert('复制成功');
			e.clearSelection();
		});
	});
</script>

</html>